import React, { useCallback, useEffect, useState } from 'react';
import { getMessage, TextWidget } from '@inbiz/react';
import { Modal } from 'antd';

const FormDodal = (props) => {
  const [visible, $visible] = useState(false);
  const [isAdd, $isAdd] = useState(false);
  const [currentData, $currentData] = useState(null);

  useEffect(() => {
    $visible(props.visible);
    // 显示时如果是修改，通过currentData回填表单
  }, [props.visible]);

  useEffect(() => {
    $isAdd(props.isAdd);
  }, [props.isAdd]);

  useEffect(() => {
    $currentData(props.currentData);
  }, [props.currentData]);

  const ok = useCallback(() => {
    let data;
    if (isAdd) {
      data = { title: getMessage('Tag.newData'), a: 1, b: 2 };
    } else {
      data = { title: getMessage('Tag.editData'), a: 4, c: 7 };
    }
    props.onOk && props.onOk(data);
  }, [isAdd, props.onOk]);

  const cancel = () => {
    props.onCancel && props.onCancel();
  };

  return (
    <>
      <Modal
        visible={visible}
        title={isAdd ? getMessage('Tag.customAdd') : getMessage('Tag.customEdit')}
        okText={getMessage('Tag.btn.ok')}
        cancelText={getMessage('Tag.btn.cancel')}
        onOk={ok}
        onCancel={cancel}
      >
        <TextWidget>Tag.notForm</TextWidget>
      </Modal>
    </>
  );
};

export default FormDodal;
